<template>
  <div class="building-dialog">
      {{dialogTitle}}
    <el-dialog
      :title="dialogTitle"
      :visible.sync="show"
      :before-close="close"
      width="75%"
      center
    >
      <el-form :model="addForm" :rules="rules" ref="addForm" label-width="100px">
        <el-form-item label="uid：">
          <el-input v-model="addForm.pid" disabled></el-input>
        </el-form-item>
        <el-form-item label="名称：" prop="name">
          <el-input v-model="addForm.name"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="addBuiding">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { mapState } from 'vuex'
import http from "../../api/nodec";
export default {
  props: {
    show: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      buildingAdd:'',
        rules: {
             name:[
                    { required: true, message: '小区名不能为空',trigger:'blur'},
                ]
        }
    };
  },
  computed: {
      ...mapState({
          dialogTitle: state => state.building.dialogTitle,
          addForm: state => state.building.addForm
      })
  },
  mounted() {
      console.log(this.$store)
  },
  methods: {
    close () {
        this.$emit('close', false)
    },
    async addBuiding () {
        // vuex 中拿到addForm 需要添加的字段
        console.log('需要提交的数据', this.addForm)
        const {errCode } = await http.buildingAdd(this.addForm)
        if (errCode === 10000) {
            this.$message.success(this.dialogTitle+'成功')
            this.$emit('close',false, undefined, undefined, 1)
            this.$refs.addForm.resetFields()
        } else {
            this.$message.error(this.dialogTitle+'失败')

        }

    }

  }
};
</script>

<style lang="less" scoped>

</style>